<template>
  <div>
    <h1 style="margin:10px auto;text-align:center;">详细路线</h1> 
    <van-button icon="revoke" round type="gray" @click="$router.push('/explore')" style="z-index:10;position: fixed;right:10px;bottom:10px;">返回</van-button>
    <van-grid :column-num="1" :gutter="20" :data="Routes">
      <van-grid-item v-for="item in Routes" :key="item.id">
        <h4>{{item.route}}</h4>
      </van-grid-item>
    </van-grid>
  </div>
</template>

<script>
 import httpApi from '@/http';
  export default {
    data() {
      return {
        type_id:this.$route.params.type_id,
        Routes: []
      }
    },
    mounted(){
        //加载详细路线
    httpApi.RouteApi.queryByTypeId({type_id:this.type_id}).then(res=>{
        console.log(res);
        this.Routes=res.data.data
      })
    }
  }
</script>

<style>
.van-grid-item__content--center{
  align-items:flex-start;
  /* background-color: brown;
  color:white; */
}
</style>